body {
    margin: 0;
    font-family: "Microsoft YaHei";
    font-size: 12px;
    line-height: 24px;
    color:#555;
    background: #fcfcfc;
}
ul,ol,dl,dd,h1,h2,h3,h4,h5,h6,p,input,button {
    margin: 0;
    padding: 0;
}
ul,ol {
    list-style: none;
}
input,button {
    font-family: "Microsoft YaHei";
}
a {
    color:#555;
    text-decoration: none;
}
a:hover {
    color:#f30;
    text-decoration: none;
}
.clearfloat:after {
    content: "";
    display: table;
    height: 0;
    clear: both;
    visibility: hidden;
}
.container {
    width:1000px;
    margin: 0 auto;
}

/*top*/
.top {
    height: 28px;
    line-height: 28px;
    background: #f9f9f9;
    border-bottom:1px solid #eee;
}
.top ul {
    float: right;
}
.top ul li {
    float: left;
    margin-left:15px;
}
.top ul li a {
    display: block;
}
.top .favorite a,.top .mobilephone a,.top .email,.top .telephone {
    background: url(../images/iconlist.png) no-repeat;
}
.top .favorite a {
    padding-left:20px;
    background-position: 0 6px;
}
.top .favorite a:hover {
    padding-left:20px;
    background-position: 0 -24px;
}
.top .mobilephone a {
    padding-left:14px;
    background-position: 0 -53px;
    color:#f60;
}
.top .mobilephone a:hover {
    padding-left:14px;
    background-position: 0 -83px;
}
.top .email {
    padding-left:20px;
    background-position: 0 -111px;
}
.top .telephone {
    padding-left:22px;
    background-position: 0 -143px;
}
/*header*/
.header {
    height: 90px;
    background: #fff;
}
.logo {
    width: 84px;
    height: 41px;
    background: url(../images/logo.png) no-repeat 0 0;
    float: left;
    margin-top: 21px;
}
.logo>a {
    display: block;
    height: 100%;
}
.h_right {
    float: right;
    margin-top:29px;
}
.search {
    float: left;
}
.search input {
    vertical-align: top;
    box-sizing: border-box;
    width: 430px;
    height: 32px;
    border:1px solid #ccc;
    border-right: none;
    padding-left: 10px;
}
.search button {
    vertical-align: top;
    width: 50px;
    height: 32px;
    background: #57bc4c url(../images/iconlist.png) no-repeat 14px -175px;
    border:none;
}
.search button:hover {
    background-color: #4aaf3f;
}
.h_cart {
    float: left;
    margin-left: 20px;
    position: relative;
}
.h_cart>a {
    display: block;
    box-sizing: border-box;
    width:140px;
    height: 32px;
    line-height: 30px;
    border:1px solid #ddd;
    padding-left:9px;
    background: #f9f9f9;
    position: relative;
    z-index: 801;
}
.h_cart:hover>a {
    color:#555;
    background: #fff;
    border-bottom: 0;
}
.icon-cart {
    display: inline-block;
    vertical-align: middle;
    width:19px;
    height: 14px;
    background: url(../images/iconlist.png) no-repeat 0 -210px;
    margin-right: 9px;
    margin-top:-4px;
}
.icon-arrows {
    display: inline-block;
    vertical-align: middle;
    border:4px solid transparent;
    border-top-color:#57bc4c ;
    margin-left:9px;
    margin-top:2px;
    transition: all .3s;
    transform-origin:center 2px;
}
.h_cart:hover .cart_dropdown {
    display: block;
}
.h_cart:hover .icon-arrows {
    transform: rotate(180deg);
}

/*购物车下拉菜单*/
.cart_dropdown {
    position: absolute;
    top:31px;
    right: 0;
    width: 260px;
    background: #fff;
    border:1px solid #ddd;
    display: none;
    z-index: 800;
}
.cart_dropdown>h3 {
    font-size: 16px;
    text-align: center;
    font-weight: lighter;
    padding: 30px 0;
}
.cart_dropdown ul li {
    padding: 16px 0 16px 10px;
    border-bottom: 1px dotted #ddd;
}
.cart_dropdown ul li>a,.cart_dropdown ul li>dl {
    float: left;
}
.cart_dropdown ul li>a>img {
    display: block;
    width: 60px;
    height: 38px;
}
.cart_dropdown ul li>dl {
    line-height: 20px;
    margin-left:15px;
}
.cart_dropdown ul li>dl dt {
    width: 140px;
    overflow: hidden; /*自动隐藏文字*/
    text-overflow: ellipsis;/*文字隐藏后添加省略号*/
    white-space: nowrap;/*强制不换行*/
}
.cart_dropdown ul li>dl dd {
    color:#f63;
}
.cart_dropdown ul li>dl dd span {
    color: #ccc;
}
.cart_dropdown ul li>em {
    float: right;
    margin:12px 8px 0 0;
    width: 14px;
    height: 14px;
    background:url(../images/iconlist.png) no-repeat 0 -460px;
}
.cart_dropdown ul li>em:hover {
    cursor: pointer;
    background-position: 0 -480px;
}
.cart_dropdown .sum {
    padding: 16px 10px;
}
.cart_dropdown .sum p {
    float: left;
    font-size: 13px;
    font-weight: bold;
    line-height: 30px;
}
.cart_dropdown .sum p span {
    color: #f63;
}
.cart_dropdown .sum a {
    float: right;
    width: 60px;
    height: 30px;
    line-height: 30px;
    color: #fff;
    font-size: 14px;
    text-align: center;
    background: #f63;
}
.cart_dropdown .sum a:hover {
    background: #ff774a;
}

/*navbar*/
.navbar {
    height: 40px;
    background: #57bc4c;
    border-bottom:2px solid #c1eebd;
}
.nav {
    float: left;
}
.nav ul li {
    float: left;
}
.nav ul li a {
    display: block;
    padding: 0 24px;
    line-height: 40px;
    color: #fff;
    font-size: 15px;
}
.nav ul li a:hover {
    background: #4aaf3f;
}
.nav ul li.active a {
    background: #3da232;
}
.nav_user {
    float: right;
    position: relative;
}
.nav_user>p {
    width: 140px;
    text-align: center;
    color:#fff;
    line-height: 40px;
    font-size: 15px;
    background: #77c558;
}
.nav_user>p>a {
    color: #fff;
}
.nav_user>p>a:hover {
    color: #ffff99;
}
.nav_user>a {
    display: block;
    font-size: 15px;
    color:#fff;
    line-height: 40px;
    background: #77c558;
    padding: 0 14px 0 12px;
}
.nav_user>a:hover {
    background: #82cb64;
}
.icon-user {
    display: inline-block;
    vertical-align: middle;
    width:20px;
    height: 22px;
    background: url(../images/iconlist.png) no-repeat 0 -250px;
    margin-right: 12px;
    margin-top:-4px;
}
.icon-triangle {
    display: inline-block;
    vertical-align: middle;
    border:4px solid transparent;
    border-top-color:#fff ;
    margin-left:14px;
    margin-top:2px;
    transition: all .3s;
    transform-origin:center 2px;
}
.nav_user:hover .icon-triangle {
    transform: rotate(180deg);
	
}
.nav_user:hover .user_dropdown{
	display: block;
}
.user_dropdown {
    position: absolute;
    top:40px;
    right:0;
    background: #fff;
    width: 280px;
    font-size: 13px;
    box-shadow: 2px 2px 3px #999;
    display: none;
    z-index: 900;
}
.user_dropdown>p {
    padding: 16px 18px;
}
.user_dropdown>p>span {
    color: #f60;
}
.user_dropdown .userlink_1 {
    padding: 0 12px 16px;
}
.user_dropdown .userlink_1>a {
    float: left;
    width: 120px;
    height: 32px;
    line-height: 32px;
    color: #fff;
    text-align: center;
    background: #57bc4c;
}
.user_dropdown .userlink_1>a:last-child {
    float: right;
}
.user_dropdown .userlink_1>a:hover {
    background: #4aaf3f;
}
.user_dropdown .userlink_2>button{
	padding:0;
	border:none;
	outline:none;
	background-color:transparent;
}
.user_dropdown .userlink_2>a,.user_dropdown .userlink_2>button {
    float: left;
    line-height: 40px;
    text-align: center;
    width: 140px;
    box-sizing: border-box;
    border-top:1px solid #ddd;
	
}
.user_dropdown .userlink_2>a:hover,.user_dropdown .userlink_2>button:hover {
    background: #f9f9f9;
}
.user_dropdown .userlink_2>button{
    border-left:1px solid #ddd;
}
/*footer*/
.footer {
    margin-top: 50px;
    background: #eee;
    border-top:1px solid #ddd;
}
.f_1 {
    margin: 10px 0;
}
.f_1 ul {
    float: left;
}
.f_1 ul li {
    float: left;
    margin-right: 110px;
}
.f_1 ul li h5 {
    font-size: 14px;
    font-weight: lighter;
}
.f_1 ul li a {
    display: block;
    color: #666;
}
.f_1 ul li a:hover {
    color: #f60;
}
.f_1 dl {
    float: left;
    margin-top: 30px;
}
.f_1 dl dt {
    float: left;
    width: 40px;
    height: 39px;
    background: url(../images/iconlist.png) no-repeat 0 -410px;
    margin-top: 10px;
}
.f_1 dl dd {
    float: left;
    font-size: 18px;
    line-height: 30px;
    color: #666;
    margin-left: 20px;
}
.f_2 {
    text-align: center;
    color: #999;
    padding: 8px 0;
    border-top:1px solid #ddd;
    line-height: 20px;
}




